var session = sessionStorage.getItem("session");
if (!session) {
	window.parent.location = "../../login.html";
}

$(function() {
	initData();
	$.ajax({
		url: IP + "GetAreaInfoList_Combobox?&session" + session,
		Type: "GET",
		dataType: 'json',
		jsonp: "callback",
		jsonpCallback: "resultHandler",
		success: function(data) {
			var s = {
				"id": "全部",
				"text": "全部"
			}
			data.unshift(s)

			$("#city").combobox({
				data: data,
				valueField: 'id',
				editable: false,
				textField: 'text',
				onLoadSuccess: function() {  
					var val = $(this).combobox("getData");
					for (var item in val[0]) {
						if (item == "id") {
							$(this).combobox("select", val[0][item]);
						}
					}
					getList();
				}
			});

		},
		error: function() {
			//alert("aaaa");
		}
	})
	$("#search").bind("click", function() {
		var s = $('#txtBeginTime').datebox('getValue');
		var e = $("#txtEndTime").datebox('getValue');
		var city = $('#city').combobox('getText');

		if (s.trim() == "") {
			$.messager.alert('提醒', "请选择开始日期", 'info');
			return false;
		}
		if (e.trim() == "") {
			$.messager.alert('提醒', "请选择结束日期", 'info');
			return false;
		}
		if (city && s && e) {
			var PostData = {
				session: session,
				sDate: s,
				eDate: e,
				city: city,
			};
			$("#jqGrid").jqGrid("setGridParam", {
				url: IP + "GetProbeStateCountDays?callback=?",
				mtype: "Post",
				postData: PostData,
				datatype: "jsonp",

			}).trigger("reloadGrid");
		}
		$("#chartType").val("1");
		insertopertlog('探针管理', '探针状态监测', '查询', '', '');
	});
})

function getList() {
	var sa = $('#txtBeginTime').datebox('getValue');
	var en = $("#txtEndTime").datebox('getValue');
	var cy = $('#city').combobox('getText');
	var Data = {
		session: session,
		sDate: sa,
		eDate: en,
		city: cy,
	};
	$("#jqGrid").jqGrid({
		url: IP + "GetProbeStateCountDays?callback=?",
		mtype: "Post",
		postData: Data,
		datatype: "jsonp",
		colModel: [{
			label: '序号',
			sorttype: 'integer',
			name: 'id',
			key: true,
			width: 50,
			hidden: true,
		}, {
			label: '在线',
			name: 'online',
			width: 100,
			align: "center",
		}, {
			label: '离线',

			name: 'offline',
			width: 100,
			align: "center",
		}, {
			label: '总数',
			name: 'sumnum',
			width: 100,
			align: "center",
		}, {
			label: '地区',
			name: 'city',
			width: 100,
			align: "center",
		}, {
			label: '统计时间',
			name: 'cTime',
			width: 150
		}],
		loadonce: true,
		viewrecords: true,
		autowidth: true,
		rowNum: 15,
		page: 1,
		rownumbers: true,
		pager: "#jqGridPager",
		loadComplete: function(data) {
			var h = $("body").height();
			$("#jqGrid").jqGrid("setGridHeight", h - 140)
			drawChart("column");
		}
	});

}

function initData() {
	var curr_time = new Date();
	$("#txtBeginTime").datebox("setValue", myformatter1(curr_time));
	$("#txtEndTime").datebox("setValue", myformatter2(curr_time));

	var chart = [
		['1', "柱状图"],
		['2', '折线图']
	]
	$("#chartType").combobox({
		data: chart,
		valueField: 0,
		textField: 1,
		value: '1',
		onSelect: function(n) {
			var val = n[0];
			switch (val) {
				case "1":
					drawChart("column");
					break;
				case "2":
					drawChart("line");
					break;

			}

		}
	});

}

function drawChart(t) {
	$("#container").html("");
	var tType = t;
	var times = [];
	var onlines = [];
	var offlines = [];
	var Ids = $("#jqGrid").getDataIDs();

	for (var i = 0; i < Ids.length; i++) {
		var getRow = $("#jqGrid").getRowData(Ids[i]);

		times.push(getRow.cTime);
		onlines.push(parseInt(getRow.online));
		offlines.push(parseInt(getRow.offline));
	}
	drawClumn(tType, times, onlines, offlines);
}

function drawClumn(t, times, onlines, offlines) {

	var h = $("body").height();
	$('#container').highcharts({
		chart: {
			type: t,
			backgroundColor:"#43e975",
			height: (h - 90),
			borderRadius: "5",
			style: {
				fontFamily: 'Microsoft YaHei',
				fontSize: '12px',
				color: '#fff'
			}
		},
		title: {
			text: '探针统计图 '
		},
		xAxis: {
			categories: times
		},
		yAxis: {
			min: 0,
			title: {
				text: '探针在线情况'
			},
			stackLabels: {
				enabled: true,
				style: {
					color: (Highcharts.theme && Highcharts.theme.textColor) || 'red'
				}
			}
		},
		legend: {
			align: 'right',
			x: -70,
			verticalAlign: 'top',
			y: 20,
			floating: true,
			backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
			borderColor: '#CCC',
			borderWidth: 1,
			shadow: false
		},
		tooltip: {
			formatter: function() {
				return '<b>' + this.x + '</b><br/>' +
					this.series.name + ': ' + this.y + '<br/>' +
					'Total: ' + this.point.stackTotal;
			}
		},
		plotOptions: {
			column: {
				stacking: 'normal',
				dataLabels: {
					enabled: true,
					color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'green'
				}
			}
		},
		series: [{
			name: '在线',
			data: onlines,
		}, {
			name: '离线',
			data: offlines,
		}]
	});

}

function myformatter1(date) {
	var y = date.getFullYear();
	var m = date.getMonth() + 1;
	var d = date.getDate() - 3;
	return y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d);
}

function myformatter2(date) {
	var y = date.getFullYear();
	var m = date.getMonth() + 1;
	var d = date.getDate();
	return y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d);
}

function myparser(s) {
	if (!s) return new Date();
	var ss = (s.split('-'));
	var y = parseInt(ss[0], 10);
	var m = parseInt(ss[1], 10);
	var d = parseInt(ss[2], 10);
	if (!isNaN(y) && !isNaN(m) && !isNaN(d)) {
		return new Date(y, m - 1, d);
	} else {
		return new Date();
	}
}